<%@page import="cn.sundat.utils.UUIDUtils"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="./css/regulations.css" rel="stylesheet" type="text/css"/>
    <link href="css/common.css" rel="stylesheet" type="text/css"/>
    <link href="css/register.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<%
	String lingpai =  UUIDUtils.getUUid();
	session.setAttribute("s_lingpai", lingpai);
	pageContext.setAttribute("c_lingpai", lingpai);
%>
<!------IE浏览器判断------>
<!--[if lt IE 9]>
<script type="text/javascript" src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<![endif]-->
<jsp:include page="head.jsp"></jsp:include>
<div class="main">
    <div class="poistion">
        <h4 class="clearfix">
            <span class="icon icon1"></span><span> 首页 > 立即注册 </span>
        </h4>
    </div>
    <form action="company_register" id="formId" onsubmit="return validate_form(this);" enctype="multipart/form-data" method="post">
    <input type="hidden" value="${c_lingpai }" name="c_lingpai">
        <div class="content step-body" id="formbox">
            <div class="step-header">
                <ul class="item clearfix" id="status">
                    <li class="step-active first" id="firsts">
                        <div class="rect">
                            <p class="rect-item">
                                <span>1</span>
                            </p>
                        </div>
                        <p class="bottom-txt">阅读入会须知</p>
                    </li>
                    <li id="second">
                        <div class="rect">
                            <p class="rect-item">
                                <span>2</span>
                            </p>

                        </div>
                        <p class="bottom-txt">基本信息填写</p>
                    </li>
                    <li id="third">
                        <div class="rect">
                            <p class="rect-item">
                                <span>3</span>
                            </p>

                        </div>
                        <p class="bottom-txt">基本材料上传</p>
                    </li>
                    <li id="fourth">
                        <div class="rect">
                            <p class="rect-item">
                                <span>4</span>
                            </p>

                        </div>
                        <p class="bottom-txt">完成</p>
                    </li>
                </ul>
            </div>
            <div class="step-content clearfix">
                <div class="step-list" style="display: block">
                    <div class="content">
                        <h2>
                            入会须知
                        </h2>
                        <h3>一、入会条件</h3>
                        <ol class="lists">
                            <li>1.诚实守信,有志于推动“诚信新疆”建设，规范市场主体合同行为,引导企(事)业单位强化合同管理，优化社会信用环境的企事业单位和社会团体;</li>
                            <li>2.在我区行政区域内注册登记且连续两年以上正常经营的企业法人组织、个体工商户，以及实行企业化管理的事业单位，均可申请参加“守合同重信用”单位活动;</li>
                            <li>3.申请参加“守合同重信用单位”活动，实行自愿原则;</li>
                            <li>4.拥护信用协会章程，愿意参加协会活动；</li>
                            <li>5.遵守国家法律,企业无失信违法行为和受处罚记录,且无经营性亏损,经营效益较好。</li>
                        </ol>
                        <h3>二、入会程序</h3>
                        <ol class="lists">
                            <li>1.通过协会网站(www.xje-ca.cn)提出申请;</li>
                            <li>2.按要求如实填写《入会申请表》;</li>
                            <li>3.申请人向秘书处提交相关资料；</li>
                            <li>4.秘书处入会审核。</li>
	</ol>
			<h3>三、注意事项</h3>
                         <ol class="lists">
                             <li>企业必须保证申请材料中填报的信息真实有效。</li>
        </ol>
	    </div>
	</div>
	<div class="step-list" style="display:none;">
	    <div class="pos">
		<span> * 为必填项</span>
	    </div>
	    <div class="forms">
		<table>
		     <tr>
			<th><span>*</span>企业名称：</th>
			<td><input type="text" id="username" name="company.comp_name" placeholder="请输入企业名称"
				   onchange="checkUser()"></td>
			<td class="warning" id="username-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>企业代码：</th>
			<td><input type="text" name="company.comp_code" id="usercode" placeholder="请输入企业注册代码"
				   onchange="userCode()"></td>
			<td class="warning" id="usercode-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>联系方式：</th>
			<td><input type="text" id="userphone" placeholder="请输入相关人员手机号" onchange="userPhone()"
			name="profile.pro_phone">
			</td>
			<td class="warning" id="userphone-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：</th>
			<td><input type="password" id="password" placeholder="请输入您的密码" onchange="passWord()"
			name="company.comp_pwd">
			</td>
			<td class="warning" id="password-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>确认密码：</th>
			<td><input type="password" id="againword" placeholder="请再次输入密码" onchange="againWord()">
			</td>
			<td class="warning" id="againword-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>电子邮箱：</th>
			<td><input type="email" id="email" placeholder="请输入您的邮箱" onchange="emailCheck()" name="profile.pro_email"></td>
			<td class="warning" id="email-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>企业地址：</th>
			<td><input type="text" id="place" placeholder="请输入企业所在地址" onchange="placeCheck()" name="profile.pro_address"></td>
			<td class="warning" id="place-warn"></td>
		    </tr>
		    <tr>
			<th><span>*</span>经营范围：</th>
			<td><textarea placeholder="请输入企业经营范围"
				      style=" resize: none; height: 35px; padding: 5px; overflow-y: hidden;"
				      id="business" onblur="businessCheck()" name="profile.pro_scope"></textarea>
			</td>
			<td class="warning" id="business-warn"></td>
		    </tr>
		    <tr>
			<th>&nbsp;&nbsp;公司简介：</th>
			<td><textarea placeholder="请输入企业简介"
				      style="resize: none; height: 90px; padding: 5px; overflow-y: hidden;"
				      maxlength="500" id="introduce" name="profile.pro_intro"></textarea>
			</td>
			<td class="warning" id="introduce-warn"></td>
		    </tr> 
		</table>
	    </div>
	</div>
	<div class="step-list" style="display:none;">
	    <div class="pos">
		<span>*&nbsp;此为必须上传项</span>
	    </div>
	    <div>
		<div class="img-box full">
		    <section class=" img-section">
			<ul class="items clearfix">
			    <li><p class="up-p"><span class="star">*&nbsp;</span><span class="up-span">1.上传营业执照复印件（加盖公章）</span>
			    </p></li>
			    <li><p class="up-p"><span class="star">*&nbsp;</span><span
				    class="up-span">2.上传入会申请书</span></p></li>
			    <li class="lis3"><p class="up-p"><span
				    class="up-span">3.上传合法纳税证明</span></p></li>
			    <li class="lis4"><p class="up-p"><span
				    class="up-span">4.上传生产企业相关的资质及环保证明</span></p></li>
			    <li class="lis5"><p class="up-p"><span class="up-span">5.上传工商部门无犯罪记录证明</span></p>
			    </li>
			</ul>
			<div class="itemes">
			    <p class="up-p"><span class="up-span">6. "守合同重信用"企业申报表(多页图片可纵向拼接成一张图片文件上传)</span></p>
			</div>
			<div class="z_photo upimg-div clearfix item1">
			    <section class="z_file fl">
				<img src="images/pic07.png" class="add-img">
				<input type="file"  name="upload" id="file1" class="file1"
				       value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple/>
			    </section>
			</div>
			<div class="z_photo upimg-div clearfix item2">
			    <section class="z_file fl">
				<img src="images/pic03.png" class="add-img">
				<input type="file"  name="upload" id="file2" class="file2"
				       value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple/>
			    </section>
			</div>
			<div class="z_photo upimg-div clearfix item3">
			    <section class="z_file fl">
				<img src="images/pic01.png" class="add-img">
				<input type="file"  name="upload" id="file3" class="file3" 
				       value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple onchange="hiddentext(this.id)"/>
			    </section>
			    <input type="hidden" value="" name="file3">
			</div>
			<div class="z_photo upimg-div clearfix item4">
			    <section class="z_file fl">
				<img src="images/pic05.png" class="add-img">
				<input type="file"  name="upload" id="file4" class="file4"
				       value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple onchange="hiddentext(this.id)"/>
			    </section>
			    <input type="hidden" value="" name="file4">
			</div>
			<div class="z_photo upimg-div clearfix item5">
			    <section class="z_file fl">
				<img src="images/pic06.png" class="add-img">
				<input type="file" name="upload" id="file5" class="file5" value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple onchange="hiddentext(this.id)"/>
			    </section>
			    <input type="hidden" value="" name="file5">
			</div>
			<div class="z_photo upimg-div clearfix item6">
			    <section class="z_file fl">
				<img src="images/pic06.png" class="add-img">
				<input type="file" name="upload" id="file6" class="file6" value=""
				       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple onchange="hiddentext(this.id)"/>
			    </section>
			    <input type="hidden" name="file6">
			</div>
		    </section>
		    <div class="multi">
			<p class="up-p"><span
				class="up-span">上传荣誉证书（多文件上传，可上传1至5张）</span></p>
			<section class=" img-section">
			    <div class="z_photo upimg-div clearfix">
				<div class="z_parent">
				    <section class="z_file fl">
					<img src="images/pic02.png" class="add-img">
					<input type="file" name="upload" id="file7" class="file" value=""
					       accept="image/jpg,image/jpeg,image/png,image/bmp" multiple onchange="hiddentext(this.id)"/>
				    </section>
				    <input type="hidden" name="file7">
				</div>
			    </div>
			</section>
		    </div>
		    <aside class="mask works-mask">
			<div class="mask-content">
			    <p class="del-p ">您确定要删除作品图片吗？</p>
			    <p class="check-p"><span class="del-com wsdel-ok">确定</span><span
				    class="wsdel-no">取消</span></p>
			</div>
		    </aside>
		</div>
	    </div>
	</div>
	<div class="step-list" style="display:none;">
	    <h3 class="finish"><i class="icon1"></i>审核中</h3>
                    <p class="warn-txt">您的注册正在审核，请等待。</p>
                </div>
            </div>
        </div>
        <div class="btn_nav clearfix">
            <input type="button" id="preBtn" value="上一步" style="display: none">
            <input type="button" id="nextBtn" value="已阅读入会须知">
            <input type="submit" id="submites" value="确认提交" style="display:none">
        </div>
    </form>
</div>
<!--页脚-->
<jsp:include page="/foot.jsp"></jsp:include>
<script src="js/jquery.step.js"></script>
<script src="js/imgUp.js"></script>
<script src="js/regulations.js"></script>
<script>
	function hiddentext(id){
		//本id值等于hidden的name值，将本id的value值设置为hidden的value值
		var v = $("#"+id).val();
		$("input[name='"+id+"']").val(v);
	}
    //    表单验证
    var flag = {};
    function check(id, reg, spanId, errorInfo, flag) {
        var val = document.getElementById(id).value;
        var oSpanNode = document.getElementById(spanId);
        if (reg.test(val) && val != "") {
            oSpanNode.innerHTML = "";
            flag[id] = true;
        } else {
            oSpanNode.innerHTML = errorInfo.fontcolor("#c93d00");
            flag[id] = false;
        }
        return flag;
    }
    $("form").submit(function () {
        var a=$("#file1").val();
        var b=$("#file2").val();
        if(a==""){
            alert("请上传营业执照");
            return false
        }
       else if(b==""){
            alert("请上传入会申请");
            return false
        }
        else{
            return true
            
        }
    });
    function legs(obj) {
        $(" #nextBtn").attr("disabled", "disabled");
        var keys = [];
        for (var key in obj) {
            if (obj[key] === true) {
                keys.push(key);
                var a = keys.length;
                if (a == 7) {
                    $("#nextBtn").removeAttr("disabled").css("background", "#c93d00");
                }
                else {
                    $("#nextBtn").css({"background": "#bfbfbf", "left": "500px"})
                }
                console.log(keys);
            }
        }
    }
    function checkUser() {
        var reg = new RegExp("^.{3,40}$");
        check("username", reg, "username-warn", "请填写您的公司全称", flag);
        legs(flag);
    }
    function userCode() {
        var reg = new RegExp("^[A-Za-z0-9]{18}$", "i");
        check("usercode", reg, "usercode-warn", "请输入正确的公司注册代码号", flag);
        legs(flag);
    }
    function userPhone() {
        var reg = new RegExp("^0?(13|15|18|17|16)[0-9]{9}$");
        check("userphone", reg, "userphone-warn", "请输入正确的手机号", flag);
        legs(flag);
    }
    function passWord() {
        var reg = new RegExp("^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$");
        check("password", reg, "password-warn", "密码至少输入6-16个字符，请使用英文字母和数字组合密码", flag);
        legs(flag);
    }
    function againWord() {
        var flag;
        var rp = document.getElementById("againword").value;
        var ps = document.getElementById("password").value;
        var oSpanNodes = document.getElementById("againword-warn");
        if (rp == ps) {
            flag = true;
        }
        else {
            oSpanNodes.innerHTML = "请再次确认密码是否一致".fontcolor("#c93d00");
            flag = false;
        }
        return flag;
    }
    function emailCheck() {
        var reg = new RegExp("^\\w+((-\\w+)|(\\.\\w+))*\\@[A-Za-z0-9]+((\\.|-)[A-Za-z0-9]+)*\\.[A-Za-z0-9]+$");
        check("email", reg, "email-warn", "请准确的填写您的邮箱，E-mail是重要工具，包括找回密码，接受邀请函等", flag);
        legs(flag);
    }
    function placeCheck() {
        var reg = new RegExp("^.{3,40}$");
        check("place", reg, "place-warn", "请输入企业具体地址", flag);
        legs(flag);
    }
    function businessCheck() {
        var reg = new RegExp("^.{3,40}$");
        check("business", reg, "business-warn", "请输入企业基本经营范围", flag);
        legs(flag);
    }
    function submit(){
    	$("#formId").submit();
    }
    
    //    上一步 下一步
    $(function () {
    	  var step = $("#formbox").step();
          if ($(" #status .step-active").hasClass("first")) {
              $("#nextBtn").val("已阅读入会须知").css("left", "500px");
              $("#preBtn").hide();
              $(" #nextBtn").click(function (event) {
                  legs(flag);
                  var yes = step.nextStep();
                  $(" #status li").removeClass("first");
                  $(this).val("下一步").css("left", "580px");
                  $(" #preBtn").show();
                  var $c = $(" #status .step-active");
                  var e = $c.length;
                  if (e == 1){
                    $("#preBtn").hide();
                    $("#nextBtn").removeAttr("disabled").css({"background":"#c93d00","left":"500px"})}

                  if (e == 2) {
                      legs(flag);
                      $("#preBtn").hide();
                      $(" #nextBtn").attr("disabled", "disabled").css({"background": "#bfbfbf", "left": "500px"});
                  }
                  if (e == 3) {
                      $("#nextBtn").hide();
                      $("#submites").show().css("left", "680px");

                  }
                  if (e == 4) {
                      $("#preBtn").hide();
                      picValid(".item1");
                      picValid(".item2");
                      picValid(".item3");
                      picValid(".item4");
                      $("#nextBtn").val("审核中").css("left", "535px");
                  }
              });
          }
          $(" #preBtn").click(function (event) {
              var $a = $(" #status .step-active");
              var b = $a.length;
              if (b == 2) {
                  legs(flag);
                  $("#preBtn").hide();


              }
              if (b == 3) {
                  legs(flag);
                  $("#preBtn").hide();
                  $("#submites").hide();
                  $("#nextBtn").show().val("下一步").css("left", "500px");
              }
              var yes = step.preStep();//上一步;
          });
    });
</script>
</body>
</html>
